function foo([x, y, z]) {
  console.log(x, y, z);
}
foo([0]); // 0 undefined undefined
foo([1, 2]); // 1 2 undefined
foo([3, 4, 5]); // 3 4 5

function bar({ x, y }) {
  console.log(x, y);
}
bar({}); // undefined undefined
bar({ x: 1 }); // 1 undefined
bar({ y: 2 }); // undefined 2
bar({ x: 1, y: 2 }); // 1 2
// 解构是可以换名
function bar2({ x: a, y: b }) {
  console.log(a, b);
}
bar2({ x: 10, y: 20 }); // 10 20
// 可以设置默认值
function bar3({ x: a = 66, y: b }) {
  console.log(a, b);
}
bar3({ x: 11 }); // 11 undefined
bar3({ y: 22 }); // 66 22
// ES2018 后，解构对象也可以使用剩余形参
function bar4({ x, y, ...props }) {
  console.log(x, y, props);
}
bar4({ x: 10, z: 12, m: 3 }); // 10 undefined {z: 12, m: 3}
// 解构层级可以很深
function bar5({
  a: [
    {
      x,
      y: { z },
    },
  ],
}) {
  // a 和 y 只是中间层，因此不能使用
  console.log(x, z);
}
bar5({ a: [{ x: 1, y: { z: 3 } }] }); // 1 3
